// src/components/sidebar/LogoContainer.tsx

import { HiAcademicCap } from "react-icons/hi";

const LogoContainer = ({ collapsed = false, mobile = false }: { collapsed?: boolean; mobile?: boolean }) => (
  <div
    className={`flex items-center gap-3 text-lg font-bold px-6 py-6 border-b border-gray-100 dark:border-slate-800 text-gray-900 dark:text-gray-100 transition-all duration-300 ${collapsed ? 'justify-center px-2' : ''} ${mobile ? 'border-none py-2 px-2' : ''}`}
  >
    <span
      className={`flex items-center justify-center rounded-full shadow-lg transition-all duration-300
        ${collapsed || mobile ? 'w-12 h-12' : 'w-16 h-16'}
        bg-gradient-to-br from-blue-600 via-cyan-500 to-blue-400 dark:from-blue-700 dark:via-cyan-700 dark:to-blue-500
      `}
    >
      <HiAcademicCap className={`transition-all duration-300 text-white ${collapsed || mobile ? 'text-2xl' : 'text-4xl'}`} />
    </span>
    {!collapsed && !mobile && (
      <span className="ml-2 whitespace-nowrap select-none text-3xl font-extrabold tracking-wide font-poppins">
        Co-op
      </span>
    )}
  </div>
);

export default LogoContainer;